<div class="mainRight" id="serve_list">
    <div class="serve_list_title">服务器列表</div>
    <div class="serve_search">
    	<input type="text" name="" placeholder="输入查询的内容" id="search_value">
    	<span id="serve_list_search" data-bind="click: searchServeList">查询</span>
    </div>
	<div class="serve_operation">
		<div data-bind="click: checkall">全选</div>
		<div data-bind="click: addServe">添加</div>
		<div data-bind="click: deleteServe">删除</div>
		<div data-bind="click: changeServe">修改</div>
	</div>
    <ul class="listmes">
    	<li>
    		<span style="width:40px;" data-bind="click: checkall">选中</span>
    		<span>资产编号</span>
    		<span>ip地址</span>
    		<span>用户名</span>
    		<span>密码</span>
    	</li>
    	<ul data-bind="foreach: servelist">
    		<li class="serve_item">
    			<span style="width:40px"><input type="checkbox" name="1" class="item_selected"></span>
    			<span data-bind="text: $data.assetId"></span>
    			<span data-bind="text: $data.ipAddress" class="ipaddress"></span>
    			<span data-bind="text: $data.userName"></span>
    			<span data-bind="text: $data.password"></span>
    		</li>
    	</ul>
    </ul>
    <div class="serve_list_bot">
    	 <div class="cdn_count">共有<span id="cdn_list_counts" data-bind="html: getCdnCounts()"></span>条，每页显示10条</div>
        <div class="cdn_page">
            <span id="cdn_first" data-bind="click: pageFirst"><<</span>
            <span id="cdn_before" data-bind="click: pageBefore"><</span>
            <span id="cdn_current" data-bind="text: currentPage"></span>
            <span id="cdn_after" data-bind="click: pageAfter">></span>
            <span id="cdn_last" data-bind="click: pageLast">>></span>
        </div>
    </div>
    <table id="table" summary="Department List" aria-label="Departments Table"
       data-bind="ojComponent: {component: 'ojTable', 
                                data: datasource, 
                                columns: [{headerText: 'Department Id', 
                                           sortProperty: 'assetId'},
                                          {headerText: 'Department Name', 
                                           sortProperty: 'ipAddress'},
                                          {headerText: 'Location Id', 
                                           sortProperty: 'userName'},
                                          {headerText: 'Manager Id', 
                                           sortProperty: 'password'}],
                                           rowTemplate: 'row_tmpl'}">
    </table>

<script type="text/html" id="row_tmpl">
    <tr>
        <td data-bind="text: assetId">
        </td>
        <td data-bind="text: ipAddress">
        </td>
        <td data-bind="text: userName">
        </td>
        <td data-bind="text: password">
        </td>
        <td><input type="checkbox" name="">
        </td>
    </tr>
</script>
    <div id="serve_add">
    	<div class="serve_title">
    		<span>添加新的服务器</span>
    		<span class="serve_close" data-bind="click: diagoClose">关闭</span>
    	</div>
    	<div class="serve_content">
    		<div>
    			<label>资产编号</label>
    			<input type="text" name="" id="assetId">
    		</div>
    		<div>
    			<label>ip地址</label>
    			<input type="text" name="" id="IPAddress">
    		</div>
    		<div>
    			<label>用户名</label>
    			<input type="text" name="" id="username">
    		</div>
    		<div>
    			<label>密码</label>
    			<input type="password" name="" id="password">
    		</div>
    	</div>
    	<div class="serce_bot">
    		<span id="add_serve">确定</span>
    		<span data-bind="click: diagoClose">取消</span>
    	</div>
    </div>
    <div id="serve_change">
    	<div class="serve_title">
    		<span>修改服务器配置</span>
    		<span class="serve_close" data-bind="click: diagoClose">关闭</span>
    	</div>
    	<div class="serve_content">
    		<div>
    			<label>资产编号</label>
    			<input type="text" name="" id="cassetId" disabled value="asdf">
    		</div>
    		<div>
    			<label>ip地址</label>
    			<input type="text" name="" id="cIPAddress">
    		</div>
    		<div>
    			<label>用户名</label>
    			<input type="text" name="" id="cusername">
    		</div>
    		<div>
    			<label>密码</label>
    			<input type="password" name="" id="cpassword" disabled>
    		</div>
    	</div>
    	<div class="serce_bot">
    		<span>确定</span>
    		<span data-bind="click: diagoClose">取消</span>
    	</div>
    </div>
    <div id="serve_delete">
        <div class="serve_title">
            <span>删除服务器</span>
            <span class="serve_close" data-bind="click: diagoClose">关闭</span>
        </div>
        <div class="serve_content">
            <span class="delete_serlist"></span>
        </div>
        <div class="serce_bot">
            <span id="delete_serve">确定</span>
            <span data-bind="click: diagoClose">取消</span>
        </div>
    </div>
</div>
